<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>search</title>
</head>

<body>
  <h2>search</h2>
  <h3>1 佩华(query) 2 向阳(path)</h3>
  <form>
    <label for="search">用户ID: </label>
    <input type="text" id="search">
    <!-- 按钮默认类型 submit -->
    <button>搜索</button>
  </form>
  <script>
    document.addEventListener('DOMContentLoaded', () => { // dom2 事件，等 DOM 节点全部加载完毕后执行回调
      // 获取节点
      const oForm = document.querySelector('form')
      // 绑定表单提交事件
      console.log()
      oForm.onsubmit = async (e) => {
        // 阻止事件默认行为
        e.preventDefault(oForm)
        // 获取输入框的值
        const id = document.querySelector('#search').value
        if (id == '1') {
          // 发送请求
          try {
            const result = await AJAX.get(`/query?id=${id}&${Date.now()}`) // 使用时间戳 Date.now() 让每一次的请求地址不同，防止浏览器缓存
            console.log(result)
          } catch (error) {
            console.log(error)
          }
          return
        }
        try {
          const result = await AJAX.get(`/path/${id}?_=${Date.now()}`) // 使用时间戳 Date.now() 让每一次的请求地址不同，防止浏览器缓存
          console.log(result)
        } catch (error) {
          console.log(error)
        }
      }
    })
  </script>
  <script src="AJAX.js"></script>
</body>

</html>